<%-- 
    Document   : inicio
    Created on : 30/12/2012, 08:34:04 AM
    Author     : TOSHIBA
--%>


<%@page import="recursos.articulo_carrito"%>
<%@page import="java.util.ArrayList"%>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="en">
    <head>
        <title>guatebay</title>
        <meta charset="utf-8">
        <link rel="stylesheet" href="css/reset.css" type="text/css" media="all">
        <link rel="stylesheet" href="css/layout.css" type="text/css" media="all">
        <link rel="stylesheet" href="css/style.css" type="text/css" media="all">
        <script type="text/javascript" src="js/jquery-1.5.2.js" ></script>
        <script type="text/javascript" src="js/cufon-yui.js"></script>
        <script type="text/javascript" src="js/cufon-replace.js"></script>
        <script type="text/javascript" src="js/Amaranth_400.font.js"></script>
        <script type="text/javascript" src="js/script.js"></script>
        <script type="text/javascript" src="js/scroll.js"></script>
        <script type="text/javascript" src="js/atooltip.jquery.js"></script>

        <script type="text/javascript" src="js/ajax-dynamic-content.js"></script>
        <script type="text/javascript" src="js/ajax.js"></script>
        <script type="text/javascript" src="js/ajax-tooltip.js">
        </script>
        <link rel="stylesheet" href="css/ajax-tooltip.css" media="screen" type="text/css">
        <link rel="stylesheet" href="css/ajax-tooltip-demo.css" media="screen" type="text/css">

    </head>
    <body>       
        <div class="extra">
            <div id="page_3">
                <div class="main">
                    <!--header -->

                    <table width="800" border="1" id="encabezado" >
                        <tr>
                            <td width="600" align="center"><p align="left"> <a target="frame"><img src="images/guatebay_logo.jpg" alt="">      </a>  </p> </td>
                            <td width="800" align="center">
                                <br>
                                <form name="method" action="validar_login.jsp" method="GET">
                                    <p align="right"> Usuario: <input type="text" name="usuario" size="20"> </p>
                                    <p align="right"> Contraseña: <input type="password" name="password" size="20"> </p>
                                    <p align="right"> <input type="submit" name="boton" value="Iniciar" /> </p>
                                    <p align="right"> <a href="registro.jsp">Registrarse</a> <a href="">  Recuperar Contraseña</a> </p>
                                </form>
                            </td>
                        </tr>
                    </table>

                    <header>
                        <br>

                        <nav>
                            <ul class="menu">
                                <li><a href="#page_2">Catálogo</a></li>
                            </ul>
                        </nav>
                    </header>




                    <!--header end-->
                    <!--content -->
                    <%
                                ArrayList<articulo_carrito> catalogo = new ArrayList();
                                //LLENANDO UN CATALOGO FALSO
                                int x = 1;
                                for (int i = 1; i < 20; i++) {

                                    articulo_carrito articulo = new articulo_carrito();
                                    articulo.articuloCodigo = i;
                                    articulo.articuloCategoria = 1;
                                    articulo.articuloDescripcion = "Este es el articulo No." + i;
                                    articulo.articuloNombre = "Articulo No" + i;
                                    articulo.articuloPrecio = Math.round(((i + i) * Math.PI) / 2);
                                    articulo.articuloPuntuacion = Math.abs((((i * i) / 3) ^ 6) - (i * 2));
                                    articulo.articuloStatus = "no se q es esto";
                                    articulo.articuloUsuarioid = 1;
                                    articulo.articuloimagen = "images/page2_img" + x + ".png";
                                    x++;
                                    if (x == 7) {
                                        x = 1;
                                    }
                                    catalogo.add(articulo);
                                }
                                session.setAttribute("catalogo", catalogo);
                    %>


                    <section class="content">
                        <h2>Listado de Productos</h2>

                        <%
                                    //PINTANDO EL CATALOGO FALSO
                                    String col_izq = "<article class=\"col1\">", col_der = "<article class=\"col1 pad_left1\">";
                                    boolean izq_der = true;
                                    for (articulo_carrito articulo : catalogo) {
                                        //IMPRIMIR ARTICULOS DEL LADO IZQUIERDO
                                        if (izq_der) {
                                            col_izq += "<div class=\"wrapper pad_bot1\">"
                                                    + " <figure class=\"left marg_right1\"><a href=\"#\"><img src=\"" + articulo.articuloimagen + "\" alt=\"\"></a></figure>"
                                                    + "<a href=\"#\" onmouseover=\"ajax_showTooltip(window.event,'demo-pages/info_articulo.jsp?id2=" + articulo.articuloCodigo + "',this);return false\" >" + articulo.articuloNombre + "</a>"
                                                    + "<p><strong>Precio:<strong> " + articulo.articuloPrecio + "</p>"
                                                    + "<button type=\"button\" onclick=\"loadXMLDoc(" + articulo.articuloCodigo + ")\">Agregar a Carrito</button>"
                                                    + "</div><br><br>";
                                            izq_der = false;
                                        } //IMPRIMIR ARTICULOS DEL LADO DERECHO
                                        else {
                                            col_der += "<div class=\"wrapper pad_bot1\">"
                                                    + " <figure class=\"left marg_right1\"><a href=\"#\"><img src=\"" + articulo.articuloimagen + "\" alt=\"\"></a></figure>"
                                                    + "<a href=\"#\" onmouseover=\"ajax_showTooltip(window.event,'demo-pages/info_articulo.jsp?id2=" + articulo.articuloCodigo + "',this);return false\" >" + articulo.articuloNombre + "</a>"
                                                    + "<p><strong>Precio:<strong> " + articulo.articuloPrecio + "</p>"
                                                    + "<button type=\"button\" onclick=\"loadXMLDoc(" + articulo.articuloCodigo + ")\">Agregar a Carrito</button>"
                                                    + "</div><br><br>";
                                            izq_der = true;
                                        }


                                    }

                                    col_izq += "</article>";
                                    col_der += "</article>";
                                    out.print(col_izq);
                                    out.print(col_der);

                        %>

                    </section>
                    <!--content end-->
                </div>
                <div class="block"></div>
            </div>
        </div>
        <div class="main">
            <!--footer -->
            <footer>
                <ul class="icons">
                    <li>Análisis y Diseño de Sistemas 2 (Proyecto de Clase)</li>
                    <li><a href="#" class="normaltip"><img src="images/icon1.jpg" alt=""></a></li>
                    <li><a href="#" class="normaltip"><img src="images/icon2.jpg" alt=""></a></li>
                    <li><a href="#" class="normaltip"><img src="images/icon3.jpg" alt=""></a></li>
                    <li><a href="#" class="normaltip"><img src="images/icon4.jpg" alt=""></a></li>
                    <li><a href="#" class="normaltip"><img src="images/icon5.jpg" alt=""></a></li>
                    <li><a href="#" class="normaltip"><img src="images/icon6.jpg" alt=""></a></li>
                </ul>
            </footer>
            <!--footer end-->
        </div>
    </body>
</html>
